

Vue.createApp({
    // 定义组件
    components:{
        'left-nav': LEFT_NAV
    },
    // 初始化
    setup(){
        // reactive定义变量运行存储
        // toRefs将数据返回
        const {
            reactive, toRefs
        } = Vue
        // 定义变量，即所需数据
        const state = reactive({
            showData: {},
            showPage:{},
            userPage: {},
            classifyPage: {},
            articlePage: {},
            commentPage: {},
            currentPage: 0,
            menu:[
                {
                    name: "用户管理",
                    url: '/getUserPage',
                    page: 0,
                    limit: 10,
                    icon: 'user icon'
                },
                {
                    name: "分类管理",
                    url: '/getClassifyPage',
                    page: 0,
                    limit: 10,
                    icon: 'list ul icon'
                },
                {
                    name: "文章管理",
                    url: '/getArticlePage',
                    page: 0,
                    limit: 10,
                    icon: 'edit icon'
                },
                {
                    name: "评论管理",
                    url: '/getCommentPage',
                    page: 0,
                    limit: 10,
                    icon: 'comment icon'
                },
            ],
            showIndex: 0
        })
        $.get(getPageUrl(state.menu[0]), function(data){
            data.records.forEach((e)=>{
                // 添加一个活跃状态表示未更新
                e.active = false
            })
            state.userPage = data
            state.showPage = data
        });
        exchangeDisplay("#bgAdm .leftNav .item", "#bgAdm #main>div")
        
        // 返回数据
        return {
            ...toRefs(state)
        }
    },
    methods:{
        // 获取指定分页的数据
        getPage(page) {
            this.currentPage = page
            addActive("#bgAdm .page .pagination .item", page - 1)
            let that = this
            let index = this.showIndex
            this.menu[index].page = page
            console.log(getPageUrl(this.menu[index]));
            $.get(getPageUrl(this.menu[index]), function(data){
                console.log(data);
                data.records.forEach((e)=>{
                    // 添加一个活跃状态表示未更新
                    e.active = false
                })
                if (index == 0) {
                    that.userPage = data
                } else if (index == 1) {
                    data.records.forEach((e)=>{
                        e.description = e.description.replace(/<.*?>/g, "")
                    })
                    that.classifyPage = data
                } else if (index == 2) {
                    data.records.forEach((e)=>{
                        e.description = e.description.replace(/<.*?>/g, "")
                    })
                    that.articlePage = data
                } else if (index == 3) {
                    data.records.forEach((e)=>{
                        e.content = e.content.replace(/<.*?>/g, "")
                    })
                    that.commentPage = data
                }
                that.showPage = data
            });
        },
        // 上一页
        backPage(){
            if (this.currentPage - 1 >= 0) {
                this.getPage(this.currentPage - 1)
            }
        },
        // 下一页
        nextPage(){
            if (this.currentPage + 1 <= this.showPage.pages) {
                this.getPage(this.currentPage + 1)
            }
        },
        // 删除
        deleteById(deleteIndex, id){
            let that = this
            let index = this.showIndex
            swalConfirm("确定删除吗？", "删除操作不可逆，请谨慎操作", "error", function(){
                let url
                if (index == 0) {
                    url = "deleteUserById"
                    that.userPage.records.splice(deleteIndex, 1)
                }
                if (index == 1) {
                    url = "deleteClassifyById"
                    that.classifyPage.records.splice(deleteIndex, 1)
                } else if (index == 2) {
                    url = "deleteArticleById"
                    that.articlePage.records.splice(deleteIndex, 1)
                } else if (index == 3) {
                    url = "deleteCommentById"
                    that.commentPage.records.splice(deleteIndex, 1)
                }
                url += "/" + id
                get(url)
            })
        },
        // 更新
        update(item) {
            let index = this.showIndex
            let url = "updateUser"
            if (index == 0) {
                if (item.name == null || item.name.trim() == "") {
                    swalError("更新失败", "用户名不能为空")
                    return
                }
                if (item.address == null || item.address.trim() == "") {
                    swalError("更新失败", "住址不能为空")
                    return
                }
                if (item.email == null || item.email.trim() == "") {
                    swalError("更新失败", "邮箱不能为空")
                    return
                }
                
                let reg = /^\w+@\w+\.COM$/i
                if (item.email == null ||!String(item.email).match(reg)) {
                    swalError("更新失败", "邮箱格式错误，参考：example@QQ.COM")
                    return
                }
                if (item.tel == null ||item.tel.trim() == "") {
                    swalError("更新失败", "电话不能为空")
                    return
                }
                reg = /^\d{11}$/
                if (item.tel == null ||!String(item.tel).match(reg)) {
                    swalError("更新失败", "电话号码格式错误（11位数字），参考：13299003948")
                    return
                }
            }
            if (index == 1) {
                if (item.name.trim() == "") {
                    swalError("更新失败", "分类名不能为空")
                    return
                }
                if (item.articles < 0) {
                    swalError("更新失败", "文章数不能小于0")
                    return
                }
                if (item.fans < 0) {
                    swalError("更新失败", "粉丝数不能小于0")
                    return
                }
                if (item.description.trim() == "") {
                    swalError("更新失败", "分类描述不能为空")
                    return
                }
                let reg = /^\d+-[01]\d-[0123]\d [012]\d:[0123456]\d:[0123456]\d$/
                if (!String(item.createTime).match(reg)) {
                    swalError("更新失败", "时间格式错误，参考：2001-06-27 13:14:13")
                    return
                }
                url = "updateClassify"
            } else if (index == 2) {
                url = "updateArticle"
            } else if (index == 3) {
                url = "updateComment"
            }
            post(url, {
                item: JSON.stringify(item)
            }, function(data) {
                console.log(item);
                swalSuccess("更新成功", "数据已完成更新")
            })
            item.active = false
        },
        // 左侧导航栏更新
        setShowIndex(index) {
            this.showIndex = index
            this.getPage(0)
        },
        approve(e) {
            e.status = 1
            get("approveCommentById/" + e.commentId)
            swalSuccess("审核通过", "评论可以正常显示")
        },
        // 一键通过
        approveAll(){
            // updateComment
            let that = this
            this.commentPage.records.forEach((e)=>{
                that.approve(e)
            })

        },
        // 一键删除
        deleteAll(){
            swalConfirm("确认删除吗？", "删除操作不可逆，请慎重", "error", function(){
                this.commentPage.records.forEach((e)=>{
                    get("deleteCommentById/" + e.commentId)
                    swalSuccess("删除成功", "评论已被删除")
                })
                this.nextPage()
            })
        }
    },
    updated(){
        // 分页样式切换
        // myExchangeClass("#bgAdm .page .pagination .item")
    }
    // 绑定app
}).mount("#bgAdm")


function getPageUrl(m){
    return m.url + "/" + m.page + "/" + m.limit
}